<%@ taglib prefix="s" uri="/struts-tags" %>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/common/jquery-1.5.1.min.js"></script>
<link type="text/css" href="<%=request.getContextPath()%>/css/common/jquery/jquery-ui-1.8.14.custom_ui_dialog.css" rel="Stylesheet" />
<script type="text/javascript" src="<%=request.getContextPath()%>/js/common/jquery/ui/jquery-ui-1.8.14.custom.min_ui_dialog.js"></script>
<script>
	$(document).ready(function() {
		var formId = $(this).attr('id');
		$('#questionDiv').css("font-weight", "bold");
		
		$('form').submit(function() {			
		    var target = $('#action').val();
		    if (formId == 'evaluateExamForm') {
			    $.ajax({
					traditional: true,
					type: $(this).attr('method'),
					url: $(this).attr('action'),
					data: $(this).serialize(),
					success: function(response) {
					    var div = $('#dynamicDiv');
					    div.html(response);
					}
			    });
				return false;
		    }
		    else {
			    $.ajax({
					traditional: true,
					type: $(this).attr('method'),
					url: $(this).attr('action'),
					data: $(this).serialize(),
					success: function(response) {
					    var div = $('#questionAndAnswerDisplayDiv');
					    div.html(response);
					}
			    });
				return false;		    	
		    }
		});
		// Mouseover effect for buttons acting link links
		$(".hyperlinkButton").mouseover(function() {
			$(this).css('cursor','pointer');
			$(this).removeClass().addClass("hyperlinkButtonMouseOver");
			}).mouseout(function() {
			$(this).css('cursor','pointer');
			$(this).removeClass().addClass("hyperlinkButton");		
		});
	});
</script>

<div id="dynamicDiv">
	<div id="nextButtonDiv">
		<table width="100%">
			<tr><td width="30%">
				<s:form action="nextQuestion" namespace="/content" id="nextQuestionForm" cssClass="inlineForm">
					<s:submit type="button" cssClass="hyperlinkButton" value="Next"/>
				</s:form>
			</td><td width="30%" align="right">
				Go To Question:&nbsp;<s:select theme="simple" list="#session.examObject.allQuestionIds" name = "name" label = "Name" headerKey="-1" headerValue="Go To..."/>
			</td><td width="25%" align="right">
				<s:form action="evaluateExam" namespace="/content" id="evaluateExamForm" cssClass="inlineForm">
					<s:submit type="button" cssClass="hyperlinkButton" value="Exam Quick Review"/>
				</s:form>
			</td><td width="20%" align="right">
				<s:form action="evaluateExam" namespace="/content" id="evaluateExamForm" cssClass="inlineForm">
					<s:submit type="button" cssClass="hyperlinkButton" value="Finish Exam"/>
				</s:form>
			</td></tr>
		</table>
		<br>
	</div>
	
	<div id="questionAndAnswerDisplayDiv">
		<s:include value="nextExamQuestion.jsp" />	
	</div>	
	
</div>

<div id="goBackDiv">
	You can any time skip or cancel the exam by clicking here...<a href="<%=request.getContextPath()%>/content/exams.action" id="goBack"> Cancel exam and take me back home </a>
</div>
